<form {{action 'doSubmit' (hash ciphertext=ciphertext context=context nonce=nonce key_version=key_version) on="submit"}}>
  <div class="box is-sideless is-fullwidth is-marginless">
    <NamespaceReminder @mode="perform" @noun="rewrap" />
      <div class="content">
        <p>You can rewrap the provided ciphertext using the latest version of <code>{{key.name}}</code> as the encryption key.</p>
      </div>
    <KeyVersionSelect @key={{key}} @onVersionChange={{action (mut key_version)}} @key_version={{key_version}} />
    <div class="field">
      <label for="ciphertext" class="is-label">Ciphertext</label>
      <div class="control is-expanded">
        <IvyCodemirror @valueUpdated={{action (mut ciphertext)}} @options={{hash
              lineNumbers=true
              tabSize=2
              mode='ruby'
              theme='hashi'
            }} />
      </div>
    </div>
    {{#if key.derived}}
      <div class="field">
        <label for="context" class="is-label">
          Context
        </label>
        <div class="field has-addons">
          <div class="control">
            <Input @type="text" @id="context" @value={{context}} class="input" data-test-transit-input="context" />
          </div>
          <div class="control">
            <B64Toggle @value={{context}} @data-test-transit-b64-toggle="context" />
          </div>
        </div>
      </div>
    {{/if}}
    {{#if (eq key.convergentEncryptionVersion 1)}}
      <div class="field">
        <label for="nonce" class="is-label">Nonce</label>
        <div class="field has-addons">
          <div class="control">
            <Input @type="text" @id="nonce" @value={{nonce}} class="input" data-test-transit-input="nonce" />
          </div>
          <div class="control">
            <B64Toggle @value={{nonce}} @data-test-transit-b64-toggle="nonce" />
          </div>
        </div>
      </div>
    {{/if}}
  </div>
  <div class="field box is-fullwidth is-bottomless">
    <div class="content">
      <p class="help">
        Submitting this form will update the <code>ciphertext</code> in-place.
      </p>
    </div>
    <div class="control">
      <button type="submit" class="button is-primary">
        Rewrap
      </button>
    </div>
  </div>
</form>
<Modal @title="Copy your token" @onClose={{action (mut isModalActive)}} @isActive={{isModalActive}}>
  <section class="modal-card-body">
    <div class="box is-shadowless is-fullwidth is-sideless">
      <h2 class="title is-6">Ciphertext</h2>
      <div class="copy-text level">
        <code class="level-left" data-test-encrypted-value="ciphertext">{{ciphertext}}</code>
        <CopyButton class="button is-compact is-transparent level-right" data-test-button="modal-copy"
          @clipboardText={{ciphertext}} @buttonType="button" @success={{action (set-flash-message 'Ciphertext copied!')}}>
          <Icon @glyph="copy-action" aria-label="Copy" />
        </CopyButton>
      </div>
    </div>
  </section>
  <footer class="modal-card-foot">
    <CopyButton class="button is-primary copy-close" data-test-button="modal-copy-close" @clipboardText={{ciphertext}}
      @buttonType="button" @success={{action "toggleModal" "Ciphertext copied!"}}>
      Copy &amp; Close
    </CopyButton>
  </footer>
</Modal>
